var latitude=121.541428;
var longitude=31.06257;
//地图资源
var vm = new Vue({
    el: '#app',
    data: function() {
        return {
            winHeight: 0,
            r: 500,
            point: '0,0',
            searchType: '',
            searchDistance: {
                "chosed": "1",
                "list": [{
                    "value": "500",
                    "name": "500m"
                }, {
                    "value": "1000",
                    "name": "1000m"
                }, {
                    "value": "1500",
                    "name": "1500m"
                }, {
                    "value": "5000",
                    "name": "5000m"
                }]
            },
            searchCate: [{
                "id": "1",
                "name": "事件",
                "chosed": false
            }, {
                "id": "2",
                "name": "公司",
                "chosed": false
            }, {
                "id": "3",
                "name": "基地",
                "chosed": false
            }, {
                "id": "4",
                "name": "车辆",
                "chosed": false
            }]
        }
    },
    mounted: function() {
        var that = this;
        mui.init({});
        mui.ready(function() {
            var h = getClientHeight();
            that.winHeight = h;
            that.loadMap();
        })
    },
    methods: {
        loadMap: function(marker_data) {
            // 百度地图API功能
            var map = new BMap.Map("mapresources"); // 创建Map实例
            var mPoint = new BMap.Point(121.539779,31.051729);
            map.enableScrollWheelZoom();
            map.centerAndZoom(mPoint, 15);
            //向地图中添加比例尺控件
            var ctrlNav = new window.BMap.NavigationControl({
                anchor: BMAP_ANCHOR_TOP_LEFT,
                type: BMAP_NAVIGATION_CONTROL_LARGE
            });
            map.addControl(ctrlNav);
            var circle = new BMap.Circle(mPoint, 1000, {
                fillColor: "blue",
                strokeWeight: 1,
                fillOpacity: 0.1,
                strokeOpacity: 0.3,
                enableEditing: false
            });
            map.addOverlay(circle);
            //向地图中添加缩略图控件
            var ctrlOve = new window.BMap.OverviewMapControl({
                anchor: BMAP_ANCHOR_BOTTOM_RIGHT,
                isOpen: 1
            });
            map.addControl(ctrlOve);
            //向地图中添加比例尺控件
            var ctrlSca = new window.BMap.ScaleControl({
                anchor: BMAP_ANCHOR_BOTTOM_LEFT
            });
            map.addControl(ctrlSca);

            var marker = new BMap.Marker(mPoint); // 创建标注
            map.addOverlay(marker); // 将标注添加到地图中
            if(marker_data!=undefined&&marker_data!=null){
                $.each(marker_data, function(i, item) {
                   var point = new BMap.Point(item.lng,item.lat);
                   var marker = new BMap.Marker(point); // 创建标注
                   var label = new window.BMap.Label(item.address, { offset: new window.BMap.Size(20, -10) });
                   marker.setLabel(label);
                   var info = new window.BMap.InfoWindow("<p style=’font-size:12px;lineheight:1.8em;’></br>地址：" + item.address + "</br></p>");
                   marker.addEventListener("mouseover", function () {
                       this.openInfoWindow(info);
                   });
                   map.addOverlay(marker);
                });
            }
            //启用标注拖动
            marker.enableDragging();
            marker.addEventListener('dragend', function (e) {//拖动标注结束
                var pointNew = e.point;
                latitude = pointNew.lat;
                longitude = pointNew.lng;
            });
            if (mPoint != null) {
                circle.addEventListener("lineupdate", function (e) {
                });
            }
        },

        bindChoseRidus: function (item) {
            var that = this;
            var value = item.value;
            that.searchDistance.chosed = value;
            that.r = value;
            mui('#sRadiusMenu').popover('toggle');
            that.loadMap();
        },
        bindChoseContent: function(index) {
            var that = this;
            var item = that.searchCate[index];
            item.chosed = !item.chosed;
            mui('#sContentMenu').popover('toggle');
            var type = [];
            $.each(that.searchCate, function(i, item) {
                if(item.chosed) {
                    type.push(item.name);
                }
            });
            that.searchType = type.join(',');
            that.postData(); //提交数据 更新地图回调中执行that.loadMap()
        },
        postData: function() {
            var that = this;
            $.getJSON('/tunnel/getTunnelBaseList', {
                "point": 121.539779+','+31.051729,
                "r": that.r,
                "searchType": that.searchType
            }, function(data) {
                that.loadMap(data);
            })
        }
    }
})